<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div class="layui-form-item">
        <label>
            test1
        </label>
        <input type="number" id="number1" name="number1">
    </div>
    <div class="layui-form-item">
        <label>
            test2
        </label>
        <input type="number" id="number2" name="number2">
    </div>
    <script src="../../js/jquery.3.5.1.js"></script>
    <script>
        /**
         * 对查找到的Dom元素进行排序。
         * 原生的js操作代码比较多，所以改方法只能用jQuery
         * @domArray 使用jQuery查询到的的元素集合
         * @sortFun 比较的方法，决定了排序的顺序。
         **/
        function sortDom(domArray, sortFun) {
            if (!$ || domArray.length === 0) return null;
            if (!sortFun) return domArray.toArray().sort();
            // sortFun方法要有返回数字值，返回0，则a和b这两个元素位置不变，返回值小于0，则a元素在b元素前面，返回值大于0，则b元素在a元素前面
            return domArray.toArray().sort(sortFun)
        }
        // 尝试修改输入框中的值，运行下面的方法，看这连个输入框的位置是否改变
        var $sort = sortDom($('.layui-form-item'), function (a, b) {
            return Number($(a).find('input').val()) - Number($(b).find('input').val());
        })
        $('body').html($sort);
    </script>
</body>

</html>